<template>
<div class="page temporaryTaskDetail-page" data-page="temporaryTaskDetail"
	style="z-index: 2">
	<div class="link-page-nav">
		<a href="#" class="link" @click=$root.backToTab()> 
			<i class="iconfont icon-zuo"></i>
		</a>
	</div>
	<div class="link-page-top">
		<div class="link-page-title" style="line-height: 36px;">临时任务详情
			<i id="returnTaskBtn_{{getNewId}}" class="iconfont icon--6" style="float:right" @click="returnTask()"></i>
		</div>
	</div>
	<div class="page-content pdbottom120">
		<div class="content-panels" style="margin-top: 0">
			<div class="sta_time">
				 <span id="residueTime_{{getNewId}}"></span>
				 <span class="marginl" id="statusView_{{getNewId}}"></span>
			</div>
			<p class="tt" style="margin-bottom: 0">
				<span id="taskName_{{getNewId}}"></span>
			</p>
			<div class="creater">
				<img id="creater-head_{{getNewId}}"/>
				<div>
					<label id="uName_{{getNewId}}"></label><label id="juese_{{getNewId}}"></label>
					<p id="createTimeView_{{getNewId}}"></p>
				</div>
			</div>
		</div>

		<div class="bottom-line"></div>

		<div class="content-panels">
			<div class="pdb10" style="margin-top: 30px;">
				<a href="#"> <span class="iteml">业主单位</span> <span
					class="itemr" id="yzdwView_{{getNewId}}"></span>
				</a>
			</div>
			<div class="pdb10">
				<a href="#"> <span class="iteml">主责任人</span> <span
					class="itemr" id="zzrrView_{{getNewId}}"></span>
				</a>
			</div>
			<div class="pdb10">
				<a href="#"> <span class="iteml">参与人员</span> <span
					class="itemr" id="joinryView_{{getNewId}}"></span>
				</a>
			</div>
			<div class="pdb10">
				<a href="#"> <span class="iteml">知会人</span> <span class="itemr"
					id="knowryView_{{getNewId}}"></span>
				</a>
			</div>
			<div class="pdb10">
				<a href="#"> <span class="iteml">截止时间</span> <span
					class="itemr" id="endTimeView_{{getNewId}}"></span>
				</a>
			</div>
		</div>

		<div class="bottom-line"></div>

		<p class="his-tt">历史记录</p>
		<div id="hisView_{{getNewId}}">
		</div>
		
		<div class="submitBtn" id="feedBackBtn_{{getNewId}}" @click="gotoAppr()">反馈</div>
		<div class="submitBtn" id="apprBtn_{{getNewId}}"  @click="gotoAppr()">审核</div>
	</div>
</div>
</template>

<script>
	return {
		mounted() {
            var self = this;
            var app = self.$app;
			self.taskId=this.$route.params.taskId;
        },
        data : function() {
			return {
				taskStatus:1,
				orgIds:"",
				createAccount:"",
				taskDetail:null,
                getNewId: (new Date()).getTime(),
			}
        },
        methods : {
			backToRefresh:function(){
				var self = this;
				self.initInfoData(1);
			},
        	gotoAppr : function (){
        		var self=this;
        		app.router.navigate("/approveTask/"+self.taskStatus+"/"+self.orgIds+"/"+self.taskId+"/temporaryTaskDetail/");
        	},
        	returnTask:function(){
        		var self=this;
        		//撤销
       		  cancelTask(function(){
       		     // 点保存之后的操作
       			   self.viewBlak_update(5,2);
       		   });
        	},
        	refreshCurrentLevel : function(nowStatus){
        		var self=this;
        		self.taskStatus=nowStatus;
        		self.initInfoData(2);
        	},
        	initInfoData:function(step){//初始化任务基本信息
        		var self = this;
        		common.loading(1);
        		$("#hisView_"+self.getNewId).empty();
        		Dao.getTempTask({
        			taskId:self.taskId,
        		},function(data){
        			if(data){
        				if(step==1){
		    				self.taskStatus=data.status;
		    				self.orgIds=data.orgId;
        				}
        				self.taskDetail=data;
	    				$("#feedBackBtn_"+self.getNewId).hide();//反馈按钮
	            		$("#apprBtn_"+self.getNewId).hide();//审核按钮
	            		$("#returnTaskBtn_"+self.getNewId).hide();//撤销按钮
	            		$("#creater-head_"+self.getNewId).attr("src",picPeopleNo());
	            		if(self.taskStatus==1){//状态：1进行中 ，2：审核中，3：已完成，4：已过期，5：已撤回
	            			$("#residueTime_"+self.getNewId).empty().html(common.transNullundefinedToline(isDay(self.taskDetail.remainingTime)));
	            			if(self.taskDetail.dutyMan==userInfor.accountName || (self.taskDetail.partMan.indexOf(userInfor.accountName)>-1))
	            				$("#feedBackBtn_"+self.getNewId).show();
	            			if(self.taskDetail.createAccount==userInfor.accountName)
	            				$("#returnTaskBtn_"+self.getNewId).show();
	            		}else if(self.taskStatus==2){
	            			$("#residueTime_"+self.getNewId).empty().html(common.transNullundefinedToline(isDay(self.taskDetail.remainingTime))); 
	            			if(self.taskDetail.verifyMan==userInfor.accountName)
	            				$("#apprBtn_"+self.getNewId).show();
	            		}else if(self.taskStatus==3){
	            			$("#statusView_"+self.getNewId).empty().html(common.transNullundefinedToline("完成")); 
	            			if(step==1){
	            				$("#residueTime_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.updateTime)); 
	            			}else{
	            				$("#residueTime_"+self.getNewId).empty().html(common.transNullundefinedToline("刚刚"));
	            			}
	            		}else if(self.taskStatus==4){
	            			$("#statusView_"+self.getNewId).empty().html(common.transNullundefinedToline("逾期未完成")); 
	            			$("#residueTime_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.endtime)); 
	            			$("#residueTime_"+self.getNewId).css('color','#E07762');
	            			$("#statusView_"+self.getNewId).css('color','#E07762');
	            		}else if(self.taskStatus==5){
	            			$("#statusView_"+self.getNewId).empty().html(common.transNullundefinedToline("已撤回")); 
	            			$("#residueTime_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.updateTime)); 
	            			$("#residueTime_"+self.getNewId).css('color','#E07762');
	            			$("#statusView_"+self.getNewId).css('color','#E07762');
	            		}
	            		$("#taskName_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.content));
	            		$("#yzdwView_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.orgName));
	            		$("#zzrrView_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.dutyManName));
	            		$("#joinryView_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.partManName));
	            		$("#knowryView_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.tellManName));
	            		$("#endTimeView_"+self.getNewId).empty().html(common.transNullundefinedToline(self.taskDetail.endtime));
	        			self.getHisInfoData();
        			}else{
        				common.loading(0);
        			}
        		});
        	},
        	viewBlak_update: function (nowType,subType) {//提交数据
                var self = this;
                common.loading(1);
                Dao.addTempTaskDetail({
                    userName:userInfor.accountName,
                    deviceId:appKeyObj.deviceId,
                    createAccount: userInfor.accountName,
                    picUrls:"",
                    orgId:self.orgId,
                    type:nowType,//类型 1：创建 2：反馈，3：审核，4:驳回，5：撤回，6任务过期
                    description:"",
                    submitType:subType,//提交类型 1：表示保存 2:表示提交
                    taskId:self.taskId,
                }, function (data) {
                	common.loading(0);
                    app.methods.showToastCenter("操作成功");
                    app.router.back();
                    app.view.current.el.f7View.router.currentPageEl.f7Component.refreshCurrentLevel();
                }, true);
            },
            getUserByAccount:function(){
            	var self = this;
            	Dao.getUserByAccount({
                    account:self.createAccount,
            	},function (data){
            		common.loading(0);
            		if(data){
            			if(data.headUrl && data.headUrl!=""){
            				$("#creater-head_"+self.getNewId).attr("src",data.headUrl);
            			}
            			$("#uName_"+self.getNewId).empty().html(common.transNullundefinedToline(data.name));
            			if(data.postName)
            				$("#juese_"+self.getNewId).empty().html(common.transNullundefinedToline(data.postName));
            		}
            	});
            },
        	getHisInfoData:function(){//获取任务历史记录
     			var self = this;
     			Dao.getTempTaskDetailList({
     				userName:userInfor.accountName,
                     deviceId:appKeyObj.deviceId,
                     taskId:self.taskId,//任务id
                     //taskId:1,//任务id
     			},function (data){
     				if (data && data.length > 0) {
     					for(var i=0;i<data.length;i++){
     						var stepHtml="";
     						$("#hisView_"+self.getNewId).append(stepHtml);
     						if(data[i].type==1){ //类型 1：创建 2：反馈，3：审核，4:驳回，5：撤回，6：任务过期
     							self.createAccount=data[i].createAccount;
     							$("#createTimeView_"+self.getNewId).empty().html(common.transNullundefinedToline("创建于 "+common.transNullundefinedToline(data[i].createTime)));
	     						stepHtml=`<div class="content-panels-his" style="border: none;">
	     							<span class="his-icon" style="background-color: #2471CA">创</span>
	     							<div class="his-time">`+common.transNullundefinedToline(data[i].createTime)+`</div>
	     							<div class="his-content">由【`+data[i].accountName+`】创建</div>
	     							</div>`;
     						}else if(data[i].type==2){
     							stepHtml=`<div class="content-panels-his">
     								<span class="his-icon" style="background-color: #F3BC32">馈</span>
     								<div class="his-time">`+common.transNullundefinedToline(data[i].createTime)+`</div>
     								<div class="his-img" id="his-img-`+data[i].id+ "_" + self.getNewId +`">
     								</div>
     								<div class="his-content">
										`+data[i].description+`
     								</div>
     								<div class="his-apr">
     									反馈人<label>`+data[i].accountName+`</label>
     								</div>
     							</div>`;
     							
     						}else if(data[i].type==3){
     			               stepHtml=`<div class="content-panels-his">
     								<span class="his-icon" style="background-color: #69BA71">√</span>
     								<div class="his-time">`+common.transNullundefinedToline(data[i].createTime)+`</div>
     								<div class="his-img" id="his-img-`+data[i].id+ "_" + self.getNewId +`">
     								</div>
     								<div class="his-content">
     								`+data[i].description+`
     								</div>
     								<div class="his-apr">
     									审核人<label>`+data[i].accountName+`</label>
     								</div>
     							</div>`;
     						}else if(data[i].type==4){
     			               stepHtml=`<div class="content-panels-his">
         							<span class="his-icon" style="background-color: #E07762">驳</span>
         							<div class="his-time">`+common.transNullundefinedToline(data[i].createTime)+`</div>
         							<div class="his-img" id="his-img-`+data[i].id+ "_" + self.getNewId +`">
     								</div>
         							<div class="his-content">
	         							`+data[i].description+`
         							</div>
         							<div class="his-apr">
         								驳回人<label>`+data[i].accountName+`</label>
         							</div>
         						</div>`;
     						}else if(data[i].type==5){
     							stepHtml=`<div class="content-panels-his">
	     							<span class="his-icon" style="background-color: #2471CA">撤</span>
	     							<div class="his-time">`+common.transNullundefinedToline(data[i].createTime)+`</div>
	     							<div class="his-content">由【`+data[i].accountName+`】撤回</div>
	     							</div>`;
     						}else{
     							stepHtml=`<div class="content-panels-his">
     								<span class="his-icon" style="background-color: #E07762">×</span>
     								<div class="his-time">`+common.transNullundefinedToline(data[i].createTime)+`</div>
     								<div class="his-content">任务过期，未完成</div>
     							</div>`;
     						}
     						$("#hisView_"+self.getNewId).append(stepHtml);
     						var PicList = data[i].picUrls;
 			               	if(PicList && PicList!=""){
     			                var picAarr = PicList.split(',');
     		                  	for (var j = 0; j < picAarr.length; j++) {
									if(picAarr[j].substr(picAarr[j].length - 3) === 'mp4' || picAarr[j].substr(picAarr[j].length - 3) === '3gp' || picAarr[j].substr(picAarr[j].length - 4) === 'mpeg' || picAarr[j].substr(picAarr[j].length - 6) === 'mavip4' || picAarr[j].substr(picAarr[j].length - 3) === 'flv' || picAarr[j].substr(picAarr[j].length - 3) === 'mov'){
										$("#his-img-" + data[i].id + "_" + self.getNewId).append(`<img dataSrc="`+picAarr[j]+`" src='` + staticPath + `img/common/video-detail.png'/>`);
									}else{
										$("#his-img-" + data[i].id + "_" + self.getNewId).append(`<img dataSrc="`+picAarr[j]+`" src="`+picAarr[j]+`"/>`);
									}
     		                  	}
     		                  	
  	     		                 jQuery("#his-img-" + data[i].id + "_" + self.getNewId).off('click').on('click', {
                                     'data': picAarr
                                 }, function (e) {
									 console.log(jQuery(this).index())
									if (e.target.src && e.data.data) {
										let target = e.target.attributes[0].nodeValue;
										let index = e.data.data.indexOf(target);
										openAndShowBigImage(e.data.data, index);
									}
                                 });
 			               	}
     					}
     					self.getUserByAccount();
     				}else{
     					common.loading(0);
     				}
     			});
     		},
        },
        on: {
			pageInit: function (e, page) {
				var self = this;
				self.initInfoData(1);
				
			},
			// pageAfterIn:function (e, page) {
           	//     var self = this;
           	//  self.initInfoData(1);
            // }
		}
    }
</script>